<template>
  <div>
     <ul>
      <li><router-link to="/index">首页 </router-link> </li>
      <li><router-link to="/class">分类 </router-link></li>
      <li><router-link to="/order">订单 </router-link></li>
      <li><router-link to="/my">我的 </router-link></li>
     </ul>
     <br>
     <h1>显示路由切换的页面！</h1>
     <router-view></router-view>
   </div>
</template>



 
<script>
export default {
  name: "App",
  components: {},
  props: {},
  data() {
    return {};
  },
  computed: {},
  watch: {},
  created() {},
  methods: {}
};
</script>

<style scoped lang="less">
     ul{
      margin: 10px 10px;
      li{
        float: left;
        margin: 0 15px;
        list-style: none;
      }
     }
     .router-link-active{
      color:lightblue
     }
</style>
